/* NProgress 自定义样式 */

/* 进度条容器 */
#nprogress {
  pointer-events: none;
}

/* 进度条 */
#nprogress .bar {
  background: linear-gradient(90deg, #409eff, #67c23a);
  position: fixed;
  z-index: 1031;
  top: 0;
  left: 0;
  width: 100%;
  height: 3px;
  box-shadow: 0 0 10px rgba(64, 158, 255, 0.5);
}

/* 进度条动画 */
#nprogress .bar .peg {
  display: block;
  position: absolute;
  right: 0px;
  width: 100px;
  height: 100%;
  box-shadow: 0 0 10px rgba(64, 158, 255, 0.8), 0 0 5px rgba(64, 158, 255, 0.6);
  opacity: 1.0;
  transform: rotate(3deg) translate(0px, -4px);
}

/* 进度条动画效果 */
#nprogress .spinner {
  display: block;
  position: fixed;
  z-index: 1031;
  top: 15px;
  right: 15px;
}

#nprogress .spinner-icon {
  width: 18px;
  height: 18px;
  box-sizing: border-box;
  border: solid 2px transparent;
  border-top-color: #409eff;
  border-left-color: #409eff;
  border-radius: 50%;
  animation: nprogress-spinner 400ms linear infinite;
}

@keyframes nprogress-spinner {
  0%   { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

/* 移除默认的旋转器（可选） */
#nprogress .spinner {
  display: none;
}

/* 响应式设计 */
@media (max-width: 768px) {
  #nprogress .bar {
    height: 2px;
  }
  
  #nprogress .spinner {
    top: 10px;
    right: 10px;
  }
  
  #nprogress .spinner-icon {
    width: 16px;
    height: 16px;
  }
}

/* 深色主题支持 */
@media (prefers-color-scheme: dark) {
  #nprogress .bar {
    background: linear-gradient(90deg, #67c23a, #409eff);
    box-shadow: 0 0 10px rgba(103, 194, 58, 0.5);
  }
  
  #nprogress .bar .peg {
    box-shadow: 0 0 10px rgba(103, 194, 58, 0.8), 0 0 5px rgba(103, 194, 58, 0.6);
  }
  
  #nprogress .spinner-icon {
    border-top-color: #67c23a;
    border-left-color: #67c23a;
  }
}
